
let deliveryTableTabsObserver = null

export function deliveryBottomTabs() {
    if (deliveryTableTabsObserver) deliveryTableTabsObserver.disconnect();

    let previousValues = {
        firstStageTabs: null
    };

    deliveryTableTabsObserver = new MutationObserver(() => {
        const tabBtn = document.querySelector(
            ".future-bottom-table > .table-title-back > .future-bottom-table-title > .active"
        );
        // let tabBtnHtml = null
        // if (tabBtn.innerHTML.includes('span')) {
        //     tabBtnHtml = tabBtn.querySelector('span').innerHTML
        // } else {
        //     tabBtnHtml = tabBtn.innerHTML
        // }
        const hasChanged =
            tabBtn.innerHTML != previousValues.firstStageTabs
        if (tabBtn && hasChanged) {
            previousValues = {
                firstStageTabs: tabBtn.innerHTML
            }
            tabsClassify(tabBtn.innerHTML)
        }
    });
    deliveryTableTabsObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}

import { createTableBottomDelivery } from '@/content-scripts/components/trading/delivery/bottomTable.js'

function tabsClassify(value) {
    if ((value.includes('仓位') && !value.includes('历史仓位')) || value.includes('资金流水')) {
        if (deliveryTableObserver) deliveryTableObserver.disconnect();
        createTableBottomDelivery({ firstStageTabs: value })
    } else if (value.includes('历史仓位') || value.includes('成交记录')) {
        historicalPosition(value)
    } else if (value.includes('当前委托') || value.includes('历史委托')) {
        historicalCommission(value)
    }
}


let deliveryTableObserver = null

function historicalPosition(value) {
    console.log(value);
    if (deliveryTableObserver) deliveryTableObserver.disconnect();

    let previousValues = {
        marketValue: null
    };

    deliveryTableObserver = new MutationObserver(() => {
        const marketSelect = document.querySelector(
            ".market_select_wrap > div > #select_marketSelect > div > div > div > span"
        );
        // let tabBtnHtml = null
        // if (tabBtn.innerHTML.includes('span')) {
        //     tabBtnHtml = tabBtn.querySelector('span').innerHTML
        // } else {
        //     tabBtnHtml = tabBtn.innerHTML
        // }
        const hasChanged =
            marketSelect.innerHTML != previousValues.marketValue
        if (marketSelect && hasChanged) {
            previousValues = {
                firstStageTabs: value,
                marketValue: marketSelect.innerHTML
            }
            console.log(previousValues, 'previossssssssssss');
            // 生成表格
            createTableBottomDelivery(previousValues)
        }
    });
    deliveryTableObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}

function historicalCommission(value) {
    if (deliveryTableObserver) deliveryTableObserver.disconnect();

    let previousValues = {
        commissionValue: null
    };

    deliveryTableObserver = new MutationObserver(() => {
        const commissionType = document.querySelector(
            '.future-bottom-table > .bottom-table-container > div[style="display: block;"] > .bottom-table-title-row > .active'
        );
        // let tabBtnHtml = null
        // if (tabBtn.innerHTML.includes('span')) {
        //     tabBtnHtml = tabBtn.querySelector('span').innerHTML
        // } else {
        //     tabBtnHtml = tabBtn.innerHTML
        // }
        const hasChanged =
            commissionType.innerHTML != previousValues.commissionValue
        if (commissionType && hasChanged) {
            previousValues = {
                firstStageTabs: value,
                commissionValue: commissionType.innerHTML
            }
            console.log(previousValues, 'previossssssssssss');
            // 生成表格
            createTableBottomDelivery(previousValues)
        }
    });
    deliveryTableObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}